<!-- 本页为新建数据页，无预设数据 -->
<template>
    <div>
        <el-page-header
            content="创建资料"
            icon=""
            title="资料管理"
        />
        <el-form
            ref="newsFormRef"
            :model="newsForm"
            :rules="newsFormRules"
            label-width="80px"
            class="demo-ruleForm"
        >
            <el-form-item
                label="标题"
                prop="title"
            >
                <el-input v-model="newsForm.title" />
            </el-form-item>
            <el-form-item
                label="内容"
                prop="content"
            >
                <editor @event="handleChange" />
            </el-form-item>

            <el-form-item
                label="类型"
                prop="category"
            >
                <el-select
                    v-model="newsForm.category"
                    class="m-2"
                    placeholder="Select"
                    style="width:100%"
                >
                    <el-option
                        v-for="item in category_options"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                    />
                </el-select>
            </el-form-item>

            <el-form-item style="margin-bottom: 300px;">
                <el-button
                    type="primary"
                    @click="submitForm()"
                >添加资料</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script setup>
import { ref, reactive } from "vue";
import editor from "@/components/editor/Editor";
import Upload from "@/components/upload/Upload";
import upload from '@/util/upload'
import {useRouter} from 'vue-router'
import {useStore} from 'vuex'
import axios from "axios";
import { ElMessage } from "element-plus";
const store = useStore()
const router = useRouter()
const newsFormRef = ref();
const newsForm = reactive({
  title: "",
  content: "",
  category: 1, 
  author: store.state.userInfo.id
});

const newsFormRules = reactive({
  title: [{ required: true, message: "请输入标题", trigger: "blur" }],
  content: [{ required: true, message: "请输入内容", trigger: "blur" }],
  category: [{ required: true, message: "请选择岗位分类", trigger: "blur" }]

});

//每次editor内容改变的回调
const handleChange = data => {
  // console.log(data)
  newsForm.content = data;
};
//类别
const category_options = [
  {
    label: "就业",
    value: 1
  },
  {
    label: "面试",
    value: 2
  },
  {
    label: "简历",
    value: 3
  }
];


const submitForm = ()=>{
    newsFormRef.value.validate(async (valid)=>{
        if(valid){
            console.log(newsForm)
            const res = await axios.post("/material/add",newsForm)
            if(res.data.code===0){
                ElMessage.success("资料添加成功")
                router.push(`/information-manage/materialList`)
            }
            
        }
    })
}
</script>
<style lang="scss" scoped>
.el-form {
  margin-top: 50px;
}
</style>
